<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Adminox - Responsive Web App Kit</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <meta content="A fully featured admin theme which can be used to build CRM, CMS, etc." name="description" />
        <meta content="Coderthemes" name="author" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />

        <!-- App favicon -->
        <link rel="shortcut icon" href="/static/assets/images/favicon.ico">

        <!-- App css -->
        <link href="/static/assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="/static/assets/css/icons.css" rel="stylesheet" type="text/css" />
        <link href="/static/assets/css/metismenu.min.css" rel="stylesheet" type="text/css" />
        <link href="/static/assets/css/style.css" rel="stylesheet" type="text/css" />

        <script src="/static/assets/js/modernizr.min.js"></script>

    </head>


    <body class="bg-accpunt-pages">

        <!-- HOME -->
        <section>
            <div class="container">
                <div class="row">
                    <div class="col-sm-12">

                        <div class="wrapper-page">

                            <div class="account-pages">
                                <div class="account-box">
                                    <div class="account-logo-box">
                                        <h2 class="text-uppercase text-center">
                                            demo.com
                                        </h2>
                                    </div>
                                    <div class="account-content">
                                        <form class="form-horizontal login-form" action="{:url('PublicController/loginPost')}" method="post">
                                            <div class="form-group m-b-20 row">
                                                <div class="col-12">
                                                    <label for="username">用户名</label>
                                                    <input class="form-control" type="text" name="username" required placeholder="请输入登录账号">
                                                </div>
                                            </div>

                                            <div class="form-group row m-b-20">
                                                <div class="col-12">
                                                    <label for="password">密码</label>
                                                    <input class="form-control" type="password" required name="password" placeholder="请输入登录密码">
                                                </div>
                                            </div>

                                            <div class="form-group row m-b-20">
                                                <div class="col-12">
                                                    <label for="code">验证码</label>
                                                    <div class="form-control-code">
                                                        <input class="form-control" type="text" required name="captcha" placeholder="请输入验证码">
                                                        <div class="login-code"><img src="{:captcha_src()}" alt="captcha" onclick="this.src='{:captcha_src()}'+'?'+ Math.random();" /></div>
                                                    </div> 
                                                </div>
                                            </div>

                                            <div class="form-group row text-center m-t-10">
                                                <div class="col-12">
                                                    <button class="btn btn-md btn-block btn-custom waves-effect waves-light" type="submit">登录</button>
                                                </div>
                                            </div>
                                        </form>

                                    </div>
                                </div>
                            </div>
                            <!-- end card-box-->


                        </div>
                        <!-- end wrapper -->

                    </div>
                </div>
            </div>
          </section>
          <!-- END HOME -->

    
        <!-- jQuery  -->
        <script src="/static/assets/js/jquery.min.js"></script>
        <script src="/static/layer/layer.js"></script>
        <script>
            $(document).on('submit', '.login-form', function(event) {
                // 阻止表单的默认提交行为   
                event.preventDefault(); 

                $.post($(this).attr('action'), $(this).serialize(), function(response) {  
                    layer.msg(response.msg);
                    if (response.code == 200) {
                        setTimeout(function() { window.location.href = "{:url('Dashboard/index')}"; }, 2000);
                    } else {
                        $(".login-code img").click();
                    }
                }).fail(function(jqXHR, textStatus, errorThrown) {  
                    layer.msg("Request failed") 
                    $(".login-code img").click();
                });  
            })
        </script>
    </body>
</html>